import DetailCenterLeft from "@page/detail/comps/DetailCenterLeft";
import SortComps from "@page/search/comps/SortComps";
import TopRight from "@page/detail/comps/TopRight";
import ShopDiscount from "./../ShopDiscount";
import GoodList from "./../GoodList";
import GoodItem from "./../GoodItem";
import HttpUtils from "@page/common/utils/HttpUtils";
import Notice from "../Notice"
import ic_notfound from '@assets/ic_notfound.png'
import Pagination from "@ui/RJMart/pagination";

import "@page/detail/detail.css";
import "@page/search/searchproduct.css";
import "./style.scss";
class ShopContent extends React.Component {
    constructor(props) {
        super(props);
        this.state = {
            isShowBigImg: 2,
            sort: "",
            minPrice: "",
            maxPrice: ""
        };
    }

    componentDidMount() {
        // this.getProductInfo();
    }

    renderGoodList() {
        const { list } = this.props;
        console.log(this.props);
        if (!list || !list.length) {
            return (<div className={'search-not-fount-product1'}>
                        <img src={ic_notfound} alt=""/>
                        <div style={{height:25}} />
                        <p style={{color:'rgba(150, 150, 150, 1)',fontSize:13}}>抱歉，沒有找到相关的宝贝</p>
                    </div>);
        } else {
            return this.state.isShowBigImg === 1 ? (
                <GoodList list={list} />
            ) : (
                <GoodItem list={list} />
            );
        }
    }

    defaulSort = sort => {
        this.setState({
            sort
        });
        this.props.changeSort(sort);
    };

    setPrice = (minPrice, maxPrice) => {
        this.setState({
            minPrice,
            maxPrice
        });
        this.props.filterPrice(minPrice, maxPrice);
    };


    pageChange = pageNo => {
        this.props.handleChange(pageNo);
    };

    render() {
        const { isShowBigImg } = this.state;
        const {suppId, total,pageNo, pageSize,isLoading}=this.props
        return (
            <div className="rj_supplier_shop-wp">
                <div className="rj_shop-content">
                    <div className="rj_shop-left">
                        <TopRight inSupp={true} suppId={suppId} />
                        <div style={{ height: 20 }} />
                        <DetailCenterLeft hideHot={true} suppId={suppId} inSuppShop={true} />
                    </div>
                    <div className="rj_shop-right">
                        <Notice />
                        <ShopDiscount id={suppId} />
                        <SortComps
                            isInSupp={true}
                            lists_style={isShowBigImg}
                            setStyle={isShowBigImg => {
                                this.setState({
                                    isShowBigImg
                                });
                            }}
                            setSortword={this.defaulSort}
                            setPrice={this.setPrice}
                        />
                        {isLoading&&this.renderGoodList()}
                        {total>0 && (
                            <Pagination
                                total={total}
                                current={pageNo}
                                onChange={this.pageChange}
                                pageSize={pageSize}
                            />
                        )}
                    </div>
                </div>
            </div>
        );
    }
}

export default ShopContent;
